<template>
  <div>
     <Row>
        <input v-model="userId" placeholder="玩家Id" ></input>
        <input v-model="userName" placeholder="玩家名字" ></input>
        <Button type="primary" @click="onSearch">查询</Button>
    </Row>
    <Table :border="true" :stripe="true" :show-header="true" :data="tableData" :columns="tableColumns"></Table>
    <Page class="bottom-page" :total="totalPage" :current="crtPage" :page-size="pageSize" show-total show-elevator @on-change="onChange"></Page>
  </div>
</template>
<script>

import {getRoleBaseInfos} from '@/api/game.js'
import {getVO} from '@/common/proto-vo.js'
export default {
  data () {
    return {
      userId: '',
      userName: '',
      crtPage: 1,
      totalPage: 0,
      pageSize: 10,
      tableData: []
    }
  },
  created () {
    this.onSearch()
  },
  methods: {
    onSearch () {
      console.log('userId:', this.userId, ',userName:', this.userName, ',crtPage:', this.crtPage, ',pageSize:', this.pageSize)
      getRoleBaseInfos(this.userId, this.userName, this.crtPage, this.pageSize).then((data) => {
        if (!data) {
          return
        }
        this.tableData = []
        let RoleBaseInfoVO = getVO('RoleBaseInfoVO')
        let pv = data.data.data
        let len = pv.data.length
        for (let i = 0; i < len; i++) {
          let vo = RoleBaseInfoVO.decode(pv.data[i])
          vo.id = vo.id.toNumber()
          vo.levelPoint = vo.levelPoint.toNumber()
          vo.vipPoint = vo.vipPoint.toNumber()
          vo.points = vo.points.toNumber()
          vo.lastOnLineTime = vo.lastOnLineTime.toNumber()
          this.tableData.push(vo)
        }
        this.totalPage = pv.intValues[1]
        console.log(this.tableData)
      })
    },
    onChange (item) {
      console.log(item)
      this.crtPage = item
      this.onSearch()
    }
  },
  computed: {
    tableColumns () {
      let cols = [
        {
          title: '数字id',
          key: 'id',
          // width: 100,
          align: 'left'
          // fixed: 'left'
        },
        {
          title: '玩家名字',
          key: 'userName',
          // width: 90,
          align: 'left'
        },
        {
          title: '等级',
          key: 'level',
          // width: 90,
          align: 'left'
        },
        {
          title: '等级经验',
          key: 'levelPoint',
          // width: 90,
          align: 'left'
        },
        {
          title: 'vip',
          key: 'vip',
          // width: 90,
          align: 'left'
        },
        {
          title: 'vip经验',
          key: 'vipPoint',
          // width: 90,
          align: 'left'
        },
        {
          title: '金币',
          key: 'points',
          // width: 120,
          align: 'left'
        },
        {
          title: '运营商',
          key: 'gameOperator',
          // width: 90,
          align: 'left'
        },
        {
          title: 'ip地址',
          key: 'ipAddress',
          // width: 150,
          align: 'left'
        },
        {
          title: '硬件',
          key: 'hardware',
          // width: 90,
          align: 'left'
        },
        {
          title: '设备号',
          key: 'imieId',
          // width: 150,
          align: 'left'
        },
        {
          title: '手机',
          key: 'mobile',
          // width: 100,
          align: 'left'
        },
        {
          title: 'facebook',
          key: 'facebookId',
          // width: 90,
          align: 'left'
        },
        {
          title: '登录天',
          key: 'loginDay',
          // width: 90,
          align: 'left'
        },
        {
          title: '持续登录天',
          key: 'continueLoginDay',
          // width: 90,
          align: 'left'
        },
        {
          title: '最大连续登陆次数',
          key: 'bigContinueLoginDay',
          // width: 90,
          align: 'left'
        },
        {
          title: '最后登录时间',
          key: 'lastOnLineTime'
        }
      ]
      return cols
    }
  }
}

</script>

<style scoped>
.log-str{
  font-size: 14px;
  margin-bottom: 2px;
}
.content{
  min-height: 460px;
}
.bottom-page{
  margin-top: 5px;
  margin-bottom: 10px;
  float: right;
}
</style>
